<template>
	<div class="news">
		<div class="news_top">
			<div class="news_top_title">
				{{newDetail.title || ''}}
			</div>
			<div class="news_top_time">
				{{newDetail.addtime || ''}}
			</div>
		</div>
		<div class="news_cont">
			<rich-text :nodes="nodes"></rich-text>
		</div>
	</div>
</template>
<style lang="scss">
	.news {
		border-collapse: collapse;
		img{
			margin: 0;
			padding: 0;
			display: block;
			border-collapse: collapse;
			font-size: 0;
			line-height: 0;
		}
		p{
			height: 0;
			line-height: 0;
		}
		.news_top {
			width: 750rpx;
			min-height: 158rpx;
			background: #FFFFFF;
			font-size: 32rpx;
			font-weight: 500;
			padding: 28rpx 40rpx;
			box-sizing: border-box;
			margin: 28rpx 0;
		}

		.news_top_time {
			font-size: 28rpx;
			color: #999;
			margin-top: 14rpx;
		}

		.news_cont {
			padding: 28rpx 40rpx;
			box-sizing: border-box;
			background: #FFFFFF;
		}
	}
</style>

<script>
	export default {
		data() {
			return {
				news_id: '',
				newDetail: {},
				nodes:''
			}
		},
		onLoad(opt) {
			this.news_id = opt.id || 4
			this.getNewsDetail()
		},
		methods: {
			async getNewsDetail() {
				const {
					data
				} = await this.$request(this.$Api.indexNews, {
					news_id: this.news_id
				}, "POST")
				if (data.code !== 0) return
				this.newDetail = data.data
				var richtext = data.data.content
				const regex = new RegExp('<img', 'gi');
				richtext = richtext.replace(regex, `<img style="max-width: 100%;"`)
				this.nodes = richtext;
			}
		}
	}
</script>